<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="peoit" tagdir="/WEB-INF/tags" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<peoit:include>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 图片轮播管理 <span class="c-gray en">&gt;</span> 图片轮播列表<a class="btn btn-success radius r mr-20" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="pd-20">
    <div class="text-c">
        <form action="<c:url value="/admin/banner/list/0"/>">
            <input type="text" class="input-text" style="width:250px" placeholder="输入名称"  name="name">
            <input type="text" class="input-text" style="width:250px" placeholder="输入描述"  name="description">
            <button type="submit" class="btn btn-success radius"  name=""><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
        </form>
    </div>

    <div class="cl pd-5 bg-1 bk-gray mt-20">
        <span class="l">
            <a href="javascript:;" onclick="banner_add('添加图片轮播','<c:url value="/admin/banner/toAdd"/> ','800','700')" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加图片轮播</a>
            </span>
        <span class="r">共有数据：<strong>${viewData.count}</strong> 条</span>
    </div>
    <div class="mt-20">
        <table class="table table-border table-bordered table-hover table-bg table-sort" id="content">
            <thead>
            <tr class="text-c">
                <th width="100">图片标题</th>
                <th width="100">图片描述</th>
                <th width="90">操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${viewData.result}" var="piclist">
                <tr class="text-c">
                    <td>${piclist.title}</td>
                    <td>${piclist.description}</td>

                    <td>
                        <a title="详情" href="javascript:;" onclick="banner_dail('图片轮播详情','<c:url value="/admin/banner/toxq/${piclist.id}"/>','800','700')" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">&#xe665;</i></a>
                        <a title="删除" href="javascript:;" onclick="banner_del(this,'${piclist.id}')" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">&#xe6e2;</i></a>
                    </td>

                </tr>
            </c:forEach>
            </tbody>
        </table>
        <div id="pagelayer" style=" float: right;margin-top: 10px;"></div>
    </div>
</div>
</peoit:include>
<script type="text/javascript">

    /*图片轮播-添加*/
    function banner_add(title,url,w,h){
        layer_show(title,url,w,h);
    }


    /*图片轮播-详情*/
    function banner_dail(title,url,w,h){
        layer_show(title,url,w,h);
    }
    /*图片轮播-删除*/
    function banner_del(obj,id){

        layer.confirm('是否删除？', {
            btn : [ '是', '取消' ],
            shade : false
        }, function() {
            $.ajax({
                type : "post",
                dataType : "json",
                data : {
                    id : id
                },
                url : "<c:url value="/admin/banner/deleteBanner"/>",
                success : function(data, textStatus) {
                    layer.msg(data.msg, {
                        icon : 6,
                        time : 1000
                    }, function() {
                        location.reload(true);
                    });
                },
                error : function(data) {
                    layer.msg(data.msg, {
                        icon : 5,
                        time : 1000
                    });
                }
            });
        });

    }

    $(function(){
        //        分页
        laypage({
            cont: $('#pagelayer'), //容器。值支持id名、原生dom对象，jquery对象,
            pages: "${viewData.pages}", //总页数
            skin: '#5eb95e', //加载内置皮肤，也可以直接赋值16进制颜色值，如:#c00
            groups: "7" ,//连续显示分页数
            skip: true, //是否开启跳页
            curr: "${viewData.page}", //获取hash值为fenye的当前页
            hash: '//', //自定义hash值
            jump: function(e, first){ //触发分页后的回调
                var pagesize = "${viewData.pageSize}";
                var url = e.curr;
                if(!first){//一定要加此判断，否则初始时会无限刷新
//                    location.href = e.curr==1?pagesize : (e.curr-1) * pagesize;
                    location.href = url;
                }
            }
        });
    })
</script>